<html>
<head>
    <title>后台管理</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <link rel="icon" href="http://www.nldou.com/favicon.ico" type="image/x-icon" />
    <link rel="shortcut icon" href="http://www.nldou.com/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="<?php echo $cssroot; ?>login.css">
    <script type="text/javascript" src="<?php echo $jsroot; ?>jquery-3.1.1.min.js"></script>
</head>
<body style="background-image: url('<?php echo $imgroot; ?>admin-bg.jpg');">
<!--<div class="logo"><img src="--><?php //echo $imgroot; ?><!--nldou-logo.jpeg"></div>-->
<div class="form-wrap">
    <form action="#" id="login-form">
        <div class="login-wrap">
            <div style="width: 50%;"><div class="top-info-wrap"></div></div>
            <div class="email-wrap login-input">
                <input type="text" name="email" placeholder="用户名">
            </div>
            <div class="pw-wrap login-input">
                <input type="password" name="token" placeholder="密码">
            </div>
            <div class="captcha-wrap login-input">
                <input type="text" name="captcha" placeholder="验证码" style="width: 100px;">
                <div class="captcha-img"><?php echo $captcha; ?></div>
            </div>
            <div class="btn-wrap login-input">
                <div class="sub-btn">登陆</div>
            </div>
        </div>
    </form>
</div>


<script type="text/javascript">
    var infobox = $('.top-info-wrap');
    var posturl = "<?php echo $posturl; ?>";
    var redirecturl = "<?php echo $redirecturl; ?>";
    var updatecapurl = "<?php echo $updatecapurl; ?>";
    var logining = false;

    $('.sub-btn').click(function () {
        if (logining) return;
        var btn = $(this);
        var email = $('input[name="email"]').val();
        if(!email) {
            infobox.show();
            infobox.html('用户名不能为空');
            return;
        }

        var cap = $('input[name="captcha"]').val();
        if(!cap) {
            infobox.show();
            infobox.html('验证码不能为空');
            return;
        }

        btn.html('登陆中...');
        logining = true;

        $.ajax({
            url: posturl,
            method:'POST',
            dataType:'json',
            xhrfields:{withCredentials:true},
            data:$('#login-form').serialize(),
            success:function (res) {
                logining = false;
                btn.html('登陆');
                if(res.code == 0){
                    infobox.show();
                    infobox.html(res.msg);
                }else{
                    window.location.href = redirecturl;
                }
            }

        });
    });

    $('.captcha-img').click(function () {
        var cap = $(this);
        $.ajax({
            url: updatecapurl,
            method:'POST',
            dataType:'json',
            xhrfields:{withCredentials:true},
            data:'',
            success:function (res) {
                if(res.code == 0){
                    infobox.show();
                    infobox.html(res.msg)
                }else{
                    cap.html(res.data);
                }
            }
        });
    });

    $('input').focus(function () {
        infobox.hide();
        infobox.html('');
    });
</script>
</body>
</html>